<template>
  <!-- 第二节 -->
  <div>
    <input type="text" v-model="pinlei" />
    <ul>
      <li v-for="(i, item) in chakan" :key="item">{{ i }}</li>
    </ul>
  </div>
</template>
<script>
export default {
  data() {
    return {
      arr: ["阿迪鞋子", "耐克鞋", "李宁鞋", "乔丹鞋子"],
      pinlei: "",
      arrnew: "",
    };
  },
  // methods: {},
  computed: {
    chakan() {
      this.arrnew = [];
      this.arr.forEach((item) => {
        if (this.pinlei) {
          if (item.indexOf(this.pinlei) != -1) {
            this.arrnew.push(item);
          }
        }
      });
      return this.arrnew;
    },
  },
};
</script>
<style>
* {
  margin: 0;
  padding: 0;
}
li {
  position: relative;
}
ul,
li {
  list-style: none;
}
li {
  width: 300px;
  border: 1px solid #000;
  height: 20px;
}
b {
  position: absolute;
  right: 0;
  top: 0;
}
</style>